  <div class="editor-row">
    <div class="section">
      <h5>Parameters</h5>
      <div class="editor-option">
        <label class="small">Ranges mode</label>
        <select class="input-medium" ng-model="panel.tmode" ng-options="f for f in ['ranges']" ng-change="set_refresh(true)"></select>
      </div>
      <div class="editor-option">
        <label class="small">Field</label>
        <input type="text" class="input-small" bs-typeahead="fields.list" ng-model="panel.field" ng-change="set_refresh(true)">
      </div>
      <div class="editor-row">
        <table class="table table-condensed table-striped">
          <thead>
            <tr>
              <th>From</th>
              <th>To</th>
              <th ng-show="panel.values.length > 1">Delete</th>
            </tr>
          </thead>
          <tbody>
            <tr ng-repeat="value in panel.values">
              <td>
                <div class="editor-option">
                  <input class="input-small" type="number" ng-model="value.from" ng-change="set_refresh(true)">
                </div>
              </td>
              <td>
                <div class="editor-option">
                  <input class="input-small" type="number" ng-model="value.to" ng-change="set_refresh(true)">
                </div>
              </td>
              <td ng-show="panel.values.length > 1">
                <i ng-click="panel.values = _.without(panel.values, value);set_refresh(true)" class="pointer icon-remove"></i>
              </td>
            </tr>
          </tbody>
        </table>
        <button type="button" class="btn btn-success" ng-click="add_new_value(panel);set_refresh(true)"><i class="icon-plus-sign"></i> Add value</button>
      </div>
    </div>
  </div>
  <div class="editor-row">
    <div class="section">
      <h5>View Options</h5>
      <div class="editor-option">
        <label class="small">Style</label>
        <select class="input-small" ng-model="panel.chart" ng-options="f for f in ['bar','pie','table']"></select></span>
      </div>
      <div class="editor-option" ng-show="panel.chart == 'table'">
        <label class="small">Font Size</label>
        <select class="input-mini" ng-model="panel.style['font-size']" ng-options="f for f in ['7pt','8pt','9pt','10pt','12pt','14pt','16pt','18pt','20pt','24pt','28pt','32pt','36pt','42pt','48pt','52pt','60pt','72pt']"></select></span>
      </div>
      <div class="editor-option" ng-show="panel.chart == 'bar' || panel.chart == 'pie'">
        <label class="small">Legend</label>
        <select class="input-small" ng-model="panel.counter_pos" ng-options="f for f in ['above','below','none']"></select></span>
      </div>
      <div class="editor-option" ng-show="panel.chart != 'table' && panel.counter_pos != 'none'">
        <label class="small" >Legend Format</label>
        <select class="input-small" ng-model="panel.arrangement" ng-options="f for f in ['horizontal','vertical']"></select></span>
      </div>
      <div class="editor-option">
        <label class="small">Missing</label><input type="checkbox" ng-model="panel.missing" ng-checked="panel.missing">
      </div>
      <div class="editor-option">
        <label class="small">Other</label><input type="checkbox" ng-model="panel.other" ng-checked="panel.other">
      </div>
      <div class="editor-option" ng-show="panel.chart == 'pie'">
        <label class="small">Donut</label><input type="checkbox" ng-model="panel.donut" ng-checked="panel.donut">
      </div>
      <div class="editor-option" ng-show="panel.chart == 'pie'">
        <label class="small">Tilt</label><input type="checkbox" ng-model="panel.tilt" ng-checked="panel.tilt">
      </div>
      <div class="editor-option" ng-show="panel.chart == 'pie'">
        <label class="small">Labels</label><input type="checkbox" ng-model="panel.labels" ng-checked="panel.labels">
      </div>
    </div>
  </div>
